/**
 * Created by Administrator on 2017/3/23.
 */
import React from 'react';

//import $ from 'jquery';
//import reqwest from 'reqwest';


 class UeEditor extends React.Component{
    constructor(){
        super();
        //this.state={keys:this.props.keys,contents:this.props.contents};
    };
    getClass(tagName,className) //获得标签名为tagName,类名className的元素
    {
        if(document.getElementsByClassName) //支持这个函数
        {        return document.getElementsByClassName(className);
        }
        else
        {       var tags=document.getElementsByTagName(tagName);//获取标签
            var tagArr=[];//用于返回类名为className的元素
            for(var i=0;i < tags.length; i++)
            {
                if(tags[i].class == className)
                {
                    tagArr[tagArr.length] = tags[i];//保存满足条件的元素
                }
            }
            return tagArr;
        }
    }

    getContent () {
        var arr = [];
        arr.push("使用editor.getContent()方法可以获得编辑器的内容");
        arr.push("内容为：");
        arr.push(UE.getEditor('myEditor').getContent());
        alert(arr.join("\n"));
    }
    setContent(isAppendTo) {
        var arr = [];
        arr.push("使用editor.setContent('欢迎使用umeditor')方法可以设置编辑器的内容");
        UE.getEditor('myEditor').setContent('欢迎使用umeditor', isAppendTo);
        //alert(arr.join("\n"));
    }
    componentWillUnmount(){
        //UE.getEditor("content").destroy();
         UE.getEditor('myEditor'+this.props.keys).destroy();
        UE.delEditor('myEditor'+this.props.keys);
        var dom = document.getElementById('myEditor'+this.props.keys);
    　　if (dom) {
    　　　　dom.parentNode.removeChild(dom);
    　　　　}
    　　　　
    　　　　
    }
    shouldComponentUpdate( nextProps,  nextState){
        return true;
    }
    componentDidUpdate( prevProps,  prevState){
        return true;
    }
    componentWillMount () {

    }
    componentDidMount () {
       var ue = UE.getEditor('myEditor'+this.props.keys,{
             //这里可以选择自己需要的工具按钮名称,此处仅选择如下五个
            toolbars:[['FullScreen', 'Source', 'Undo', 'Redo','Bold','italic','underline','test']],
            
            //关闭字数统计
            wordCount:false,
            //关闭elementPath
            elementPathEnabled:false,
            //默认的编辑区域高度
            initialFrameHeight:90

            //更多其他参数，请参考umeditor.config.js中的配置项
        });

        var me = this;
        ue.ready( function( ueditor ) {
            var value = "ddddd";//me.props.value?me.props.value:'<p></p>';
            ue.setContent(me.props.contents); 

            if (!ueditor) {
            // 如果初始化后ueditor不存在删除后重新调用
               UE.delEditor('myEditor'+me.props.keys);

                 ue= UE.getEditor('myEditor'+me.props.keys,{
                     //这里可以选择自己需要的工具按钮名称,此处仅选择如下五个
                    toolbars:[['FullScreen', 'Source', 'Undo', 'Redo','Bold','italic','underline','test']],
                    
                    //关闭字数统计
                    wordCount:false,
                    //关闭elementPath
                    elementPathEnabled:false,
                    //默认的编辑区域高度
                    initialFrameHeight:90

                    //更多其他参数，请参考umeditor.config.js中的配置项
                });
             }

        }); 



  /*    var toolbar = this.getClass('div','edui-toolbar'),timer;
        toolbar.animate({top:-100},500);
        ( UE.body ).on( "mousedown", function ( evt ) {
           toolbar.animate( {
             top: 0
          }, 500 );

        }).on( 'scroll', function ( evt ) {
            clearTimeout(timer);
            timer = setTimeout(function(){
              toolbar.stop().animate( {
                    top: -100
                }, 500 );
            },50)


        } )*/

    }
    render () {
        return (
        		<script type="text/plain" id={"myEditor"+this.props.keys} style={{width:'560px',height:'90px'}}></script>
        );
    }
};

export default UeEditor;
